<!doctype html>
<html lang="en">

<head>
  <meta charset="utf-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
  <title>强化学习示例：价值与策略迭代</title>
  <meta name="description" content="">
  <meta name="author" content="">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">

  <!-- jquery and jqueryui -->
  <script src="external/jquery-2.1.3.min.js"></script>
  <link href="external/jquery-ui.min.css" rel="stylesheet">
  <script src="external/jquery-ui.min.js"></script>

  <!-- bootstrap -->
  <script src="external/bootstrap.min.js"></script>
  <link href="external/bootstrap.min.css" rel="stylesheet">

  <!-- d3js -->
  <script type="text/javascript" src="external/d3.min.js"></script>

  <!-- markdown -->
  <script type="text/javascript" src="external/marked.js"></script>
  <script type="text/javascript" src="external/highlight.pack.js"></script>
  <link rel="stylesheet" href="external/highlight_default.css">
  <script>
    hljs.initHighlightingOnLoad();
  </script>

  <!-- mathjax: nvm now loading dynamically
  <script type="text/javascript" src="https://cdn.mathjax.org/mathjax/latest/MathJax.js?config=TeX-AMS-MML_HTMLorMML"></script>
-->

  <!-- rljs -->
  <script type="text/javascript" src="lib/rl.js"></script>

  <!-- GA -->

  <style>
    #wrap {
      width: 800px;
      margin-left: auto;
      margin-right: auto;
    }

    body {
      font-family: Arial, "Helvetica Neue", Helvetica, sans-serif;
    }

    #draw {
      margin: 0 auto;
      width: 300px;
      height: 300px;
    }

    #exp {
      margin-top: 20px;
      font-size: 16px;
    }

    svg {
      cursor: pointer;
    }

    h2 {
      text-align: center;
      font-size: 30px;
    }

    #rewardui {
      font-weight: bold;
      font-size: 16px;
    }
  </style>
  <script type="text/javascript" src="lib/rl.js"></script>
  <script type="text/javascript" src="lib/smallGrid.js"></script>
  <script type="application/javascript">

  </script>

</head>

<body onload="start();">

  <a href="https://github.com/qqiang00"><img style="position: absolute; top: 0; right: 0; border: 0;" src="https://camo.githubusercontent.com/e7bbb0521b397edbd5fe43e7f760759336b5e05f/68747470733a2f2f73332e616d617a6f6e6177732e636f6d2f6769746875622f726962626f6e732f666f726b6d655f72696768745f677265656e5f3030373230302e706e67" alt="Fork me on GitHub" data-canonical-src="https://s3.amazonaws.com/github/ribbons/forkme_right_green_007200.png"></a>
  <div id="wrap">

    <div id="mynav" style="border-bottom:1px solid #999; padding-bottom: 10px; margin-bottom:50px;">
      <div>
        <img src="loop.svg" style="width:50px;height:50px;float:left;">
        <h1 style="font-size:50px;">强化学习<span style="color:#085;">示例</span></h1>
      </div>
      <ul class="nav nav-pills">
        <li role="presentation"><a href="index.html">首页</a></li>
        <li role="presentation" class="active"><a href="demo_iteration.html">迭代演示</a></li>
        <li role="presentation"><a href="gridworld_dp.html">格子世界DP</a></li>
        <li role="presentation"><a href="gridworld_td.html">格子世界: TD</a></li>
        <li role="presentation"><a href="puckworld.html">PuckWorld: DQN</a></li>
        <li role="presentation"><a href="waterworld.html">WaterWorld: DQN</a></li>
      </ul>
    </div>
    <h2>演示：4×4格子世界价值迭代及策略更新</h2>
    <br>
    <div style="text-align:center;">
      <button class="btn btn-warning" onclick="evaluatePolicy()" style="width:150px;height:50px;margin-bottom:5px;">
        单步价值迭代</button>
      <button class="btn btn-warning" onclick="evaluatePolicy2()" style="width:150px;height:50px;margin-bottom:5px;">
        连续价值迭代</button>
      <button class="btn btn-warning" onclick="updatePolicy()" style="width:150px;height:50px;margin-bottom:5px;">
        策略更新</button>
      <button class="btn btn-success" onclick="runValueIteration()" style="width:150px;height:50px;margin-bottom:5px;">
        交替迭代</button>
      <button class="btn btn-danger" onclick="resetAll()" style="width:150px;height:50px;margin-bottom:5px;">
        重置</button>
    </div>

    <br>

    <div id="draw"></div>
    <br>
    <div id="rewardui">格子奖励: <span id="creward">选择一个格子</span></div>
    <br>
    <div id="rewardslider"></div>
    <hr>
    <div id="exp" class="md">
### 简要介绍 
### 价值迭代 
### 策略更新 
### 交替迭代
    </div>
    <br><br><br>
</body>


</html>